<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="./axios-1.x/dist/axios.js"></script>
  </head>
  <body>
    <textarea
      name=""
      placeholder="请输入你的问题"
      id="ques"
      cols="30"
      rows="10"
      style="margin: 0 auto; display: block"
    ></textarea>
    <button
      id="btn"
      style="display: block; margin: 20px auto; width: 60px; height: 30px"
    >
      提问
    </button>
    <div style="text-align: center">回答区域</div>
    <div
      id="showText"
      style="background: #ccc; line-height: 30px; margin-top: 20px"
    ></div>
    <script>
      var btn = document.querySelector("#btn");
      var showText = document.querySelector("#showText");
      var question = document.getElementById("ques");
      btn.addEventListener("click", function (params) {
        alert("已经在问咯！别急别急！");
        axios
          .post(
            "https://api.openai.com/v1/completions",
            {
              prompt: question.value,
              max_tokens: 600, // 设置生成文本的最大长度
              temperature: 0.7, // 设置模型生成文本的创造性程度
              model: "text-davinci-003",
            },
            {
              headers: {
                Authorization:
                  "Bearer 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",
              },
            }
          )
          .then((response) => {
            showText.innerHTML = response.data.choices[0].text;
          })
          .catch((error) => {
            alert("出错了，等一下再搞！");
          });
      });
    </script>
  </body>
</html>
